<template>
  <Card title="附件文档" :padding="[32]" :show-divider="false">
    <view
      v-for="(item, index) in botAttachmentInfoVoList"
      :key="index"
      @click="handleOpenDocument(item)"
    >
      <view class="hb-flex hb-items-center hb-py-4 hb-border-solid hb-border-[#EBEDF0] hb-border-b">
        <TmIcon
          class="hb-flex-shrink-0"
          :name="`ali-icon ${getFileIcon(item.fileSuffix).icon}`"
          :follow-theme="false"
          :color="getFileIcon(item.fileSuffix).color"
          :font-size="80"
        />
        <view class="hb-ml-2 hb-flex-1 hb-flex hb-flex-col hb-justify-between">
          <TmText _class="text-overflow-1 hb-font-bold" :label="item.fileName" :font-size="28" />
        </view>
      </view>
    </view>
  </Card>
</template>

<script setup lang="ts">
  import { BotAttachmentInfo } from '@/api/card/type';
  import { getFileIcon } from '@/utils';
  import Card from '../../components/Card/index.vue';
  import { useUpload } from '@/hooks/file/useUpload';
  const { openDocument } = useUpload();
  interface AttachmentDocsProps {
    botAttachmentInfoVoList: BotAttachmentInfo[];
  }

  defineProps<AttachmentDocsProps>();

  const handleOpenDocument = (item: BotAttachmentInfo) => {
    openDocument({ filePath: item.filePathUrl, fileType: item.fileSuffix });
  };
</script>
